{% extends "_components/fieldtypes/elementfieldsettings" %}

{% import "_includes/forms" as forms %}

{% set fileKindOptions = field.getFileKindOptions() %}
{% set isMatrix = 'craft\\fields\\Matrix' in craft.app.view.getNamespace() %}

{% macro uploadLocationInput(name, field, inputSourceOptions) %}
    {% from "_includes/forms" import select, text %}
    <div class="flex">
        <div>
            {{ select({
                id: name~'Source',
                name: name~'Source',
                options: inputSourceOptions,
                value: field[name~'Source'],
            }) }}
        </div>
        <div class="flex-grow">
            {{ text({
                id: name~'Subpath',
                class: 'ltr',
                name: name~'Subpath',
                value: field[name~'Subpath'],
                placeholder: "path/to/subfolder"|t('app')
            }) }}
        </div>
    </div>
{% endmacro %}

{% from _self import uploadLocationInput %}


{% block fieldSettings %}
    {{ forms.checkboxField({
        label: 'Restrict assets to a single folder'|t('app'),
        id: 'useSingleFolder-toggle',
        name: 'useSingleFolder',
        class: 'use-single-folder-cb',
        value: 1,
        checked: field.useSingleFolder,
        toggle: 'single-folder-settings',
        reverseToggle: 'multi-folder-settings'
    }) }}

    {% set uploadLocationNote = "Note that the subfolder path can contain variables like <code>{slug}</code> or <code>{author.username}</code>."|t('app') %}
    {% if isMatrix %}
        {% set uploadLocationNote = uploadLocationNote|replace({
            '{slug}': '{owner.slug}',
            '{author.username}': '{owner.author.username}'
        }) %}
    {% endif %}

    <div id="multi-folder-settings"{% if field.useSingleFolder %} class="hidden"{% endif %}>
        {{ block('sourcesField') }}

        {{ forms.field({
            label: 'Default Asset Location'|t('app'),
            instructions: 'Where assets should be stored when they are uploaded directly to the field, or via a front-end form.'|t('app') ~' '~ uploadLocationNote,
            errors: field.getErrors('defaultUploadLocationSubpath')
        }, uploadLocationInput('defaultUploadLocation', field, sourceOptions)) }}
    </div>

    <div id="single-folder-settings"{% if not field.useSingleFolder %} class="hidden"{% endif %}>
        {{ forms.field({
            label: 'Asset Location'|t('app'),
            instructions: 'Where selected assets should be stored.'|t('app') ~' '~ uploadLocationNote,
            errors: field.getErrors('singleUploadLocationSubpath')
        }, uploadLocationInput('singleUploadLocation', field, sourceOptions)) }}
    </div>

    {{ forms.checkboxField({
        label: 'Show unpermitted volumes'|t('app'),
        instructions: 'Whether to show volumes that the user doesn’t have permission to view.'|t('app'),
        id: 'showUnpermittedVolumes',
        name: 'showUnpermittedVolumes',
        checked: field.showUnpermittedVolumes,
    }) }}

    {{ forms.checkboxField({
        label: 'Show unpermitted files'|t('app'),
        instructions: 'Whether to show files that the user doesn’t have permission to view, per the “View files uploaded by other users” permission.'|t('app'),
        id: 'showUnpermittedFiles',
        name: 'showUnpermittedFiles',
        checked: field.showUnpermittedFiles,
    }) }}

    {{ forms.checkboxField({
        label: 'Restrict allowed file types'|t('app'),
        class: 'restrictFiles',
        id: 'restrictFiles',
        name: 'restrictFiles',
        value: 1,
        checked: field.restrictFiles,
        toggle: 'restrict-allowed-types'
    }) }}

    <fieldset id="restrict-allowed-types"{% if not field.restrictFiles %} class="hidden indent"{% endif %}>
        {% for option in fileKindOptions %}
            {{ forms.checkboxField({
                label: option.label,
                id: 'allowedKinds-'~option.value,
                name: 'allowedKinds[]',
                value: option.value,
                checked: (option.value in field.allowedKinds)
            }) }}
        {% endfor %}
        {{ forms.errorList(field.getErrors('allowedKinds')) }}
    </fieldset>

    {{ forms.checkboxField({
        label: 'Allow uploading directly to the field'|t('app'),
        instructions: 'Whether authors should be able to upload files directly to the field, rather than requiring them to select/upload assets via the selection modal.'|t('app'),
        id: 'allow-uploads',
        name: 'allowUploads',
        checked: field.allowUploads,
    }) }}

    {{ block('limitField') }}
    {{ block('viewModeField') }}
    {{ block('selectionLabelField') }}
    {{ block('validateRelatedElementsField') }}

    <hr>

    {{ forms.selectField({
        id: 'preview-mode',
        name: 'previewMode',
        label: 'Preview Mode'|t('app'),
        instructions: 'How the related {type} should be displayed within element indexes.'|t('app', {
            type: pluralElementType,
        }),
        options: [
            {label: 'Show thumbnails and titles'|t('app'), value: 'full'},
            {label: 'Show thumbnails only'|t('app'), value: 'thumbs'},
        ],
        value: field.previewMode,
        errors: field.getErrors('previewMode'),
    }) }}

    {{ block('advancedSettings') }}
{% endblock %}
